<template>
  <div id="help">
    <Header :showheaderLeft="false" :showBack="true" :isTitle="true"></Header>
    <div class="rootMain">
      <div>
        <h2>{{$t('m.pProcess')}}：</h2>
        <p>{{$t('m.help1')}}</p>
        <p>
          <img src="@/assets/img/help2/help1.png" alt />
        </p>
        <p>{{$t('m.help2')}}</p>
        <p>
          <img src="@/assets/img/help2/help2.png" alt />
        </p>
        <p>{{$t('m.help3')}}</p>
        <p>
          <img src="@/assets/img/help2/help3.png" alt />
        </p>
        <p>{{$t('m.help4')}}</p>
      </div>
    </div>
  </div>
</template>
<script>
import Services from "@/service/index.js";
import Header from "@/components/header";
import { mapMutations, mapState } from "vuex";
export default {
  data() {
    return {};
  },
  created() {
    this.changeTitle(this.$t("m.help"));
    this.loginToken = localStorage.getItem("token")
      ? localStorage.getItem("token")
      : "";
  },
  components: {
    Header
  },
  computed: {},
  methods: {
    ...mapMutations(["changeTitle"])
  }
};
</script>
<style lang="scss" scoped type="text/scss">
#help {
  .rootMain {
    top: 0.88rem;
    height: calc(100% - 0.88rem);
    overflow-y: auto;
    div {
      padding: 0.3rem;
    }
    h2 {
      font-size: 0.3rem;
      font-weight: bold;
      height: 0.8rem;
      line-height: 0.8rem;
    }
    p {
      margin-bottom: 0.2rem;
    }
  }
}
</style>